{% load bootstrap %}

<div class="row">
	<div class="col-sm-12">
		{{form.nome|bootstrap}}
	</div>
</div>
<div class="row">
	<div class="col-sm-4">
	              {{ form.tipo_pessoa|bootstrap}}            	
                            {{ form.rg|bootstrap }}
                            {{ form.conjuge|bootstrap }}
    </div>
    <div class="col-sm-4">
        {{ form.cnpj_cpf|bootstrap}}
        {{ form.orgao_expeditor|bootstrap }}
        {{form.profissao|bootstrap}}
    </div>
    <div class="col-sm-4">
        {{ form.data_nascimento|bootstrap}}            
        {{ form.estado_civil|bootstrap }}
        {{ form.tipo_cliente|bootstrap }}
    </div>	
</div>
<div class="row">
	<div class="col-sm-6">
		{{ form.nome_mae|bootstrap}}            
	</div>
	<div class="col-sm-6">
		{{ form.nome_pai|bootstrap}}            
	</div>
</div>
<div class="row">
	<div class="col-sm-6">
		{{ form.nacionalidade|bootstrap}}            
	</div>
	<div class="col-sm-6">
		{{ form.naturalidade|bootstrap}}            
	</div>
</div>


{# Endereços #}
<div class="row">
    <div class="col-sm-8">  
    <br>
        <abbr title="Informações sobre endereços do cliente">Endereço pessoal</abbr>
        <hr>
    </div>
</div>
<div class="row">
    <div class="col-sm-8">  
        {{formEndereco.rua|bootstrap}}
    </div>
        <div class="col-sm-4">
    	  {{formEndereco.complemento|bootstrap}}
        </div> 
     </div>
 <div class="row"> 
    <div class="col-sm-2">  
        {{formEndereco.numero|bootstrap}}
    </div>
    <div class="col-sm-5">  
        {{formEndereco.bairro|bootstrap}}
    </div>
    <div class="col-sm-5">  
        {{formEndereco.cep|bootstrap}}
    </div>
</div>

<div class="row">
	<div class="col-sm-12">
      <br>
      <abbr title="Informações sobre endereços do cliente">Dados pessoais</abbr>
      <hr>
		{{form.empresa_trabalha|bootstrap}}
	</div>
</div>
<div class="row">
    <div class="col-sm-8">  
        {{formEndereco.rua_comercial|bootstrap}}
    </div>
    <div class="col-sm-4">  
        {{formEndereco.complemento_comercial|bootstrap}}
    </div>
</div>
<div class="row">
    <div class="col-sm-2">  
        {{formEndereco.numero_comercial|bootstrap}}
    </div>
    <div class="col-sm-5">  
        {{formEndereco.bairro_comercial|bootstrap}}
    </div>
    <div class="col-sm-5">  
        {{formEndereco.cep_comercial|bootstrap}}
    </div>
</div>

<div class="row">
	<div class="col-sm-12">
		<br>
	        	<abbr title="Informações sobre os contatos do cliente">Telefones de contato</abbr>
	        	<hr>
        	</div>
	<div class="col-sm-4">
		{{form.telefone_fixo|bootstrap}}
		{{form.telefone_comercial|bootstrap}}
	</div>
	<div class="col-sm-4">
		{{form.celular|bootstrap}}
                            {{form.celular_2|bootstrap}}
	</div>
	<div class="col-sm-4">
		{{form.tipo_cliente|bootstrap}}
		{{form.email|bootstrap}}
		{{form.renda|bootstrap}}
	</div>
</div>

<div class="row">
    <div class="col-sm-12">  
        <br>
        <abbr title="Informações sobre bancárias e comerciais dos clientes">Referências</abbr>
        <hr>
    </div>
</div>
<div class="row">
    <div class="col-sm-6">  
        {{form.referencias_bancarias|bootstrap}}
    </div>
    <div class="col-sm-6">  
       {{form.referencias_comerciais|bootstrap}}
    </div>
</div>

<div class="row">
    <div class="col-sm-6">  
        {{form.referencias_pessoais|bootstrap}}
    </div>
    <div class="col-sm-6">  
        {{form.observacoes|bootstrap}}
    </div>
</div>
